/*
 *  所有的异步请求功能，在独立的js中完成
 */
new Vue({
    el:"#app",
    data:{
        //定义账户对象，存储账户信息
        accountInfo:{},

        //定义Json对象，存储分页数据
        pageInfo:{}
    },
    methods:{
        deleteAccount:function(id){
            if (confirm("确定要删除吗？")){
                axios.get("/account/deleteAccount.do?id="+id).then(response=>{
                    if (response.data === "删除失败"){
                        alert("删除失败 请联系管理员");
                    }else {
                        this.queryAccountByPage(1);
                    }
                }).catch();
            }
        },


        //模态框中的修改按钮事件，发送请求，提交修改后的数据
        updateAccount:function(){
          axios.post("/account/updateAccount.do",this.accountInfo).then(response=>{
              //获取服务器响应的数据
              if(response.data === "更新失败"){
                  alert("数据更新失败，请联系管理员");
              }else {
                  //更新成功
                  //从新展示数据，调用函数
                  this.queryAccountByPage(1);
              }
          }).catch();
        },
        //修改按钮的事件，打开修改的模块框，接收要修改数据的id值
        openUpdateWindow:function(id){
            //向服务器发请求，根据传递id值，进行主键的查询回显
          axios.get("/account/queryAccountById.do?id="+id).then(response=>{
              //服务器响应回来的主键查询的数据，赋值accountInfo
              this.accountInfo = response.data;
              $("#update_modal").modal(true);
          }).catch();
        },

        //模态框上面，添加按钮的事件
        insertAccount:function(){
            //发请求，提交accountInfo数据，Json数据，已经和页面的文本框做了数据绑定
            axios.post("/account/insertAccount.do",this.accountInfo).
            then(response=>{
                //获取服务器响应的数据
                if(response.data === "添加失败"){
                    alert("数据添加失败，请联系管理员");
                }else {
                    //添加成功
                    //从新展示数据，调用函数
                    this.queryAccountByPage(1);
                }
            }).
            catch();
        },

        //添加按钮的事件，打开添加用户的窗口
        openAddWindow:function(){
            //add_modal 添加窗口的id， 另一个JS框架，JQuery，获取这个div
            //document.getElementById("add_modal")通过标签的id属性值，查找这个标签
            $("#add_modal").modal(true);//打开窗口
        },


        /**
         * 向服务器发生异步请求，进行分页功能，参数当前页数
         */
        queryAccountByPage:function (currentPage) {
            //发生GET请求，传递当前页数
            axios.get("/account/queryAccountByPage.do?currentPage="+currentPage).
            then(response=>{
                //服务器响应回来的数据，显示在页面中
                //Vue对象的data键赋值
                this.pageInfo = response.data;
            }).
            catch();
        }
    },
    //页面只要打开，向服务器发生异步请求，进行分页功能
    //向服务器提交当前第几页，就是第一页
    //Vue对象生命周期钩子函数
    mounted:function () {
        //调用函数，向服务器发生请求，传递第一页
        this.queryAccountByPage(1);
    }
});